
<template>
  <div class="app-container">
    <app-side-bar :menu-list="asyncRoutes" :collapse.sync="sideCollapsed" class="sidebar" />
    <div class="view-screen">
      <RouterView  />
    </div>
    
  </div>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import { RouterLink, RouterView } from 'vue-router'
import AppSideBar from '@/components/AppSideBar.vue'
import { homeRoutes } from "@/router/home";
const sideCollapsed = ref(false)
const asyncRoutes = homeRoutes

</script>

<style scoped>
.app-container {
  display: flex;
  flex: 1;
  height: 100%;
}
.sidebar {

}
.view-screen {
  flex: 1;
  height: 100%;
  overflow-x: hidden;
}
</style>
